/**
 * Created by mac on 2017/12/15.
 */
(function(exports){
    function minigrid(containerSelector, itemSelector, gutter, animate, done) {
        var forEach = Array.prototype.forEach;
        var containerEle = document.querySelector(containerSelector);
        var itemsNodeList = document.querySelectorAll(itemSelector);
        gutter = gutter || 6;
        containerEle.style.width = '';
        var containerWidth = containerEle.getBoundingClientRect().width;
        var firstChildWidth = itemsNodeList[0].getBoundingClientRect().width + gutter-10;
        var cols = Math.max(Math.floor((containerWidth - gutter) / firstChildWidth), 1);
        var count = 0;
        containerWidth = (firstChildWidth * cols + gutter) + 'px';
        containerEle.style.width = containerWidth;

        for (var itemsGutter = [], itemsPosX = [], g = 0; g < cols; g++) {
            itemsPosX.push(g * firstChildWidth + gutter);
            itemsGutter.push(gutter);
        }

        forEach.call(itemsNodeList, function(item){
            var itemIndex = itemsGutter.slice(0).sort(function (a, b) {
                return a - b;
            }).shift();
            itemIndex = itemsGutter.indexOf(itemIndex);
            var posX = itemsPosX[itemIndex];
            var posY = itemsGutter[itemIndex];
            var transformProps = [
                'webkitTransform',
                'MozTransform',
                'msTransform',
                'OTransform',
                'transform'
            ];
            if (!animate) {
                forEach.call(transformProps, function(transform){
                    item.style[transform] = 'translate(' + posX + 'px,' + posY + 'px)';
                });
            }
            itemsGutter[itemIndex] += item.getBoundingClientRect().height + gutter;
            count = count + 1;
            if (animate) {
                return animate(item, posX, posY, count);
            }
        });

        var containerHeight = itemsGutter.slice(0).sort(function (a, b) {
            return a - b;
        }).pop();

        containerEle.style.height = containerHeight + 'px';

        if (typeof done === 'function'){
            done();
        }
    }

    if (typeof define === 'function' && define.amd) {
        define(function() { return minigrid; });
    } else if (typeof module !== 'undefined' && module.exports) {
        module.exports = minigrid;
    } else {
        exports.minigrid = minigrid;
    }

})(this);